/**
 * 这里是uni-app内置的常用样式变量
 *
 * uni-app 官方扩展插件及插件市场（https://ext.dcloud.net.cn）上很多三方插件均使用了这些样式变量
 * 如果你是插件开发者，建议你使用scss预处理，并在插件代码中直接使用这些变量（无需 import 这个文件），方便用户通过搭积木的方式开发整体风格一致的App
 *
 */

/**
 * 如果你是App开发者（插件使用者），你可以通过修改这些变量来定制自己的插件主题，实现自定义主题功能
 *
 * 如果你的项目同样使用了scss预处理，你也可以直接在你的 scss 代码中使用如下变量，同时无需 import 这个文件
 */

/* 颜色变量 */

/* 行为相关颜色 */
$uni-color-primary: #007aff;
$uni-color-success: #4cd964;
$uni-color-warning: #f0ad4e;
$uni-color-error: #dd524d;

/* 文字基本颜色 */
$uni-text-color:#333;//基本色
$uni-text-color-inverse:#fff;//反色
$uni-text-color-grey:#999;//辅助灰色，如加载更多的提示信息
$uni-text-color-placeholder: #808080;
$uni-text-color-disable:#c0c0c0;
$uni-text-color-white:#c3dfee;

/* 背景颜色 */
$uni-bg-color:#ffffff;
$uni-bg-color-plain:#f2f4f4;
$uni-bg-color-grey:#f8f8f8;
$uni-bg-color-hover:#f1f1f1;//点击状态颜色
$uni-bg-color-mask:rgba(0, 0, 0, 0.4);//遮罩颜色
$uni-bg-color-orange:#ff7057;

/* 边框颜色 */
$uni-border-color:#e5e5e5;

/* 尺寸变量 */

/* 文字尺寸 */
$uni-font-size-sm:24rpx;
$uni-font-size-base:28rpx;
$uni-font-size-lg:32rpx;
$uni-font-size-xm:22rpx;
$uni-font-size-six:26rpx;
$uni-font-size-rty:30rpx;
$uni-font-size-thirty:32rpx;
$uni-font-size-thirty-four:34rpx;
/* 图片尺寸 */
$uni-img-size-sm:40rpx;
$uni-img-size-base:52rpx;
$uni-img-size-lg:80rpx;

/* Border Radius */
$uni-border-radius-sm: 4rpx;
$uni-border-radius-base: 6rpx;
$uni-border-radius-lg: 12rpx;
$uni-border-radius-Twenty: 20rpx;
$uni-border-radius-circle: 50%;

/* 水平间距 */
$uni-spacing-row-xm: 3rpx;
$uni-spacing-row-dm: 4rpx;
$uni-spacing-row-fm: 6rpx;
$uni-spacing-row-sm: 10px;
$uni-spacing-row-base: 20rpx;
$uni-spacing-row-lg: 30rpx;


/* 垂直间距 */
$uni-spacing-col-sm: 8rpx;
$uni-spacing-col-base: 16rpx;
$uni-spacing-col-lg: 24rpx;

/* 透明度 */
$uni-opacity-disabled: 0.3; // 组件禁用态的透明度

/* 文章场景相关 */
$uni-color-title: #2C405A; // 文章标题颜色
$uni-font-size-title:40rpx;
$uni-color-subtitle: #555555; // 二级标题颜色
$uni-font-size-subtitle:36rpx;
$uni-color-paragraph: #3F536E; // 文章段落颜色
$uni-font-size-paragraph:30rpx;

/* 公共标题 */
.titleBlock{
	font-size: $uni-font-size-thirty-four;
	letter-spacing: 5rpx;
	padding: 30rpx 0;
	position: relative;
	font-weight: 700;
	.More{
		position: absolute;
		right: 0;
		top:34rpx;
		font-size: 25rpx;
		font-weight:500;
		color: $uni-text-color-placeholder;
	}
	.icon-retuijianyinqing{
		color:#ff8302;
	}
}


/* 精选游记模块 */
.fallList {
  padding: 0 0 0;
  background-color: $uni-bg-color;
  width: 100%;
  .fallBlock {
	background-color: $uni-bg-color-plain;
	border-radius: 20rpx;
	margin-bottom: 20rpx;
	width: 100%;
	position: relative;
	.fallImg {
	  width: 100%;
	  height: 360rpx;
	  border-top-left-radius: 20rpx;
	  border-top-right-radius: 23rpx;
	}
	.mark{
		position: absolute;
		background-color: #ff8302;
		border-top-left-radius: 20rpx;
		top: 0rpx;
		left: 0;
		color: $uni-text-color-inverse;
		font-size: $uni-font-size-sm;
		padding: 10rpx 20px;
	}
	.fallTitle {
	  margin: 2% 2% 0;
	  overflow: hidden;
	  word-break: break-all;
	  text-overflow: ellipsis;
	  display: -webkit-box;
	  -webkit-box-orient: vertical;
	  -webkit-line-clamp: 2;
	  font-size: 28rpx;
	  height: 72rpx;
	  line-height: 35rpx;
	  letter-spacing: $uni-spacing-row-dm;
	  color: $uni-text-color;
	  font-weight: 600;
	}
	.fallFooter {
	  position: relative;
	  padding: 3% 2%;
	  display: flex;
	  .fallPortrait {
		color: $uni-text-color-placeholder;
		font-size: $uni-font-size-six;
		flex: 7;
		position: relative;
		image {
		  position: absolute;
		  top: 0;
		  left: 0;
		  width: 60rpx;
		  height: 60rpx;
		  border-radius: 100%;
		}
		text {
		  line-height: 60rpx;
		  display: inline-block;
		  letter-spacing: $uni-spacing-row-xm;
		  padding-left: 75rpx;
		}
	  }
	  .iconfont {
		text-align: left;
		font-size: $uni-font-size-rty;
		line-height: 60rpx;
		margin-left: 30rpx;
		color: $uni-text-color-placeholder;
		text {
		  font-size: $uni-font-size-sm;
		  padding-left: 6rpx;
		  display: inline-block;
		}
	  }
	}
  }
}
/* 热门游记 */
/* .listImg {
	width: 100%;
  .listBlcok {
    border-bottom: 1rpx solid $uni-bg-color-hover;
    padding: 0 0 30rpx 0rpx;
	margin-bottom: 30rpx;
	position: relative;
	background: #FFFFFF;
    .listTitle{
      overflow: hidden;
      word-break: break-all;
      text-overflow: ellipsis;
      display: -webkit-box;
      -webkit-box-orient: vertical;
      -webkit-line-clamp: 1;
      font-size: $uni-font-size-base;
      padding-bottom: 20rpx;
      letter-spacing: $uni-spacing-row-xm;
	  font-weight: 600;
    }
    .listMain {
      display: flex;
      image {
        flex: 1.5;
        height: 160rpx;
        border-radius: 10rpx;
      }
      .listTxt {
		word-break:break-all;
        flex: 3;
        padding-left: 20rpx;
        overflow: hidden;
        word-break: break-all;
        text-overflow: ellipsis;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 4;
        font-size: $uni-font-size-six;
        height: 156rpx;
        line-height: 40rpx;
        letter-spacing:$uni-spacing-row-dm;
        color: $uni-text-color;
      }
    }
	.listFooter{
		padding-top: 30rpx;
		display: flex;
		.listPortrait{
			color: $uni-text-color-placeholder;
			font-size: $uni-font-size-sm;
			flex: 6;
			position: relative;
			image {
			  position: absolute;
			  top: 0;
			  left: 0;
			  width: 50rpx;
			  height: 50rpx;
			  border-radius: 100%;
			}
			text {
			  line-height: 50rpx;
			  display: inline-block;
			  letter-spacing: $uni-spacing-row-dm;
			  padding-left: 70rpx;
			}
		}
		.listState{
			flex: 4;
			text-align: right;
			.iconSize{
				display: inline-block;
				font-size: $uni-font-size-xm;
				color: $uni-text-color-placeholder;
				padding-left: $uni-font-size-six;
				vertical-align: top;
				line-height: 50rpx;
				text {
				  font-size: $uni-font-size-sm;
				  padding-left: 6rpx;
				  display: inline-block;
				}
			}
		}
	}
	&:last-child{
		border-bottom: none;
		margin-bottom: 0;
	}
  }
} */